Blogging with Djot

This post explores how to use Djot as your blogging markup language and how to set up automatic deployments to Deno Deploy using GitHub Actions. Djot combines the simplicity of Markdown with the extensibility of HTML, making it an excellent choice for technical blogs.

What is Djot?

Djot is a light markup language created by John MacFarlane (the creator of Pandoc). It’s designed to be simple, unambiguous, and extensible. Unlike Markdown, which has many flavors and extensions, Djot aims to have a single standard with a clean document model.

As Alex(@matklad) mentioned in his Elements of a Great Markup Language post, a great markup language should:

  1. Have a clean abstract document model
  2. Feature tasteful syntax for common patterns
  3. Support composable processing

Djot ticks all these boxes!

Djot Features that I likes

Images and Videos

Our blog supports both static images and videos:

![Alt text](image-url.png)

For videos, we can use the .video class, and for looping videos, the .loop class:

![](video-url.webm){.video}
![](looping-video.webm){.video .loop}

Here’s an example of what a video might look like:

Code Blocks

Code blocks with syntax highlighting are supported for many languages:

fn main() {
    println!("Hello, Djot!");
}

You can also add line highlighting:

fn main() {
    println!("Hello, 0x789789 with highlightjs-zig!");
}

Keyboard Shortcuts

For keyboard shortcuts, use the .kbd class:

Press Ctrl + S to save your document or Alt + F4 to close the window.

Block Quotes

Block quotes can include citations:

The best way to predict the future is to invent it.

Alan Kay

Special Blocks

Our blog supports various special blocks:

You can also create details/summary elements:

undefined

Hidden details

This content is initially hidden until the user clicks to expand it.

Two-column Layout

For side-by-side comparisons, use the .two-col class:

- Item 1
- Item 2
- Item 3
  • Item 1
  • Item 2
  • Item 3

Final notes

Djot provides a clean, intuitive syntax for writing blog posts with rich formatting, while Deno Deploy offers an easy way to host your static site. Combined with GitHub Actions for automated deployments, you have a powerful, modern blogging platform that’s both flexible and easy to maintain.

This setup allows you to focus on writing content rather than dealing with complex CMS systems or wrestling with deployment issues. The source-controlled, plain-text nature of Djot files also makes it easy to track changes, collaborate, and maintain your content over time.

Happy blogging with Djot and Deno Deploy!